<!--
 * @Descripttion:
 * @Author: liuxiaoling
 * @Date: 2021-03-22 19:07:54
 * @LastEditors: liuxiaoling
 * @LastEditTime: 2021-03-28 18:40:05
-->
<template>
  <div class="page_hasSignUp">

    <com-top-nav-bar
      :topNavBarObj="topNavBarObj"
      @toGetKeywordOrDateStr="getKeyWordOrDateStr"
    />

    <div class="jobArr" v-if="hasSignUpList.length">
      <!--  在已报名、已工作的页面中, signuptime 为报名时间    -->
      <com-job-item
        v-for="(item, index) in hasSignUpList"
        :key="item.id"
        :serchType='1'
        :keyWord="'hasSignUpList'"
        :jobItem ="item"
      ></com-job-item>

      <van-pagination
        v-model="querySearchObj.pageIndex"
        :total-items="total"
        :items-per-page="querySearchObj.pageSize"
        @change="getPaginationValue_hasSignUp"
        force-ellipses
      >
        <template #prev-text>
          <van-icon name="arrow-left" />
        </template>
        <template #next-text>
          <van-icon name="arrow" />
        </template>
        <template #page="{ text }">{{ text }}</template>
      </van-pagination>
    </div>
    <van-divider style="margin-top: 80px" v-else>暂无记录</van-divider>
  </div>
</template>

<script>
  import comJobItem from '../../components/comJobItem';
  import comTopNavBar from "../../components/comTopNavBar";


  export default {
    name: 'hasSignUpList',
    components:{
      comJobItem,
      comTopNavBar
    },
    data(){
      return {
        topNavBarObj: {
          title: '已报名',
          searchPlaceholder: '',
          dateLabel: '已报名',
          pathForLeft: '',
        },
        hasSignUpList: [],
        total: 0,
        querySearchObj: {
          pageIndex: 1,
          pageSize: 10,
          keyword: '',
          // 报名时间
          signuptime: '',
        },
      }
    },

    created() {
      this._getJobApplyList(this.querySearchObj);
    },
    methods: {
      async _getJobApplyList(params){
        const res =  await this.$api.job.reqJobApplyList(params)
        if (res.code === 200){
          this.hasSignUpList = res.data.items
          this.total = res.data.count
        }
      },

      getPaginationValue_hasSignUp(val){
        console.log('翻页', val);
        // 指定页
        Object.assign(this.querySearchObj, {pageIndex: val})
        this._getJobApplyList(this.querySearchObj)
      },

      getKeyWordOrDateStr(val){
        const obj = {
          pageIndex: 1,
          keyword: val.keyword,
          signuptime: val.date,
        }
        Object.assign(this.querySearchObj, obj)
        this._getJobApplyList(this.querySearchObj)
      },

    }
  }
</script>

<style lang="scss" scoped>
  .page_hasSignUp{
    width: 100%;
    .over_layer{
      margin-top: 46px;
      height: 100%;
      .layer{
        width: 36%;
        font-size: 14px;
        position: absolute;
        right: 0;
        z-index: 2;
      }
    }
    .jobArr{
      &>div:last-child{
        border-bottom: .6px solid #E6E6E6;
      }
    }
  }
</style>
